<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/css/font.css}">
    <link rel="stylesheet" th:href="@{/css/xadmin.css}">
    <script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
    <script type="text/javascript" th:src="@{/js/xadmin.js}"></script>
</head>

<body style="background-color: #FFFAE3">
<div class="x-nav" style="height: 43px">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
          </span>
    <i class="layui-icon layui-icon-refresh" style="line-height:35px"></i></a>
</div>
<div id="div1">
    <table style="margin-left: 10px" id="text" lay-filter="demo"></table>
</div>
<div id="div2">
    <TABLE class="layui-table lay-even  lay-skin='line' lay-size='lg' " style="LINE-HEIGHT: 30px" cellSpacing=1 cellPadding=0 width="100%"
           bgColor=#FFFAE3 borderColorLight=#FFFAE3 border=0>
        <TBODY>
        <TR>
            <TD>
                <TABLE cellSpacing=1 cellPadding=3 width="100%" border=0>
                    <TBODY>
                    <TR bgColor=#FFFAE3>
                        <TD align=middle width="100%" bgColor=#FFFAE3 colSpan=20 height=22>
                            <H2>
                                <b color=#FFFAE3>查看供应商信息</b>
                            </H2>
                        </TD>
                    </TR>

                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">供应商编号</TD>
                        <TD colSpan=3 name="supplierNum" id="supplierNum1"></TD></TR>
                    <TR bgColor=#FFFAE3 >
                        <TD class=t1 noWrap width="20%">供应商证书编号</TD>
                        <TD name="certificate" id="certificate"></TD>
                        <TD class=t1 noWrap width="18%">公司名称</TD>
                        <td id="company1"></td>


                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">公司简称</TD>
                        <TD id="abbreviation"></TD>
                        <TD class=t1 noWrap width="18%">法人代表</TD>
                        <TD id="corporation"></TD></TR>
                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">地&nbsp;&nbsp;&nbsp;&nbsp;址</TD>
                        <TD id="address"></TD>
                        <TD class=t1 noWrap width="18%">邮&nbsp;&nbsp;&nbsp;&nbsp;编</TD>
                        <TD id="zip"></TD></TR>
                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">注册资金</TD>
                        <TD id="regFund"></TD>
                        <TD class=t1 noWrap width="18%">联&nbsp;系&nbsp;人</TD>
                        <TD id="contact"></TD></TR>
                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">电&nbsp;&nbsp;&nbsp;&nbsp;话</TD>
                        <TD id="phone"></TD>
                        <TD class=t1 noWrap width="18%">传&nbsp;&nbsp;&nbsp;&nbsp;真</TD>
                        <TD id="fax"></TD></TR>
                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">电子邮箱</TD>
                        <TD id="email"></TD>
                        <TD class=t1 noWrap width="18%">网站地址</TD>
                        <TD id="address1"></TD></TR>
                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">公司性质</TD>
                        <TD class=t2 id="kind">
                        </TD>
                        <TD class=t1 noWrap width="18%">税&nbsp;&nbsp;&nbsp;&nbsp;号</TD>
                        <TD id="dutyParagraph"></TD>
                    </TR>
                    <TR bgColor=#FFFAE3>
                        <TD class=t1 noWrap width="20%">开户银行</TD>
                        <TD id="depositBank"></TD>
                        <TD class=t1 noWrap width="18%">帐&nbsp;&nbsp;&nbsp;&nbsp;号</TD>
                        <TD id="userId"></TD></TR>
                    </TBODY></TABLE></TD></TR></TBODY></TABLE>
    <button style="margin-left: 605px" class="layui-btn" data-type="reload" onclick="FanHui()">返回</button>
</div>
</body>
<script id="button" type="text/html">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">基本信息</a>
</script>
<script id="toolbarDemo" type="text/html">
    <div className="layui-btn-container" style="font-size: 20px;font-weight: bold;width: 500px;margin-left: 560px;"
         id="divLeft">
        供应商信息一览表
    </div>
    <div class="demoTable" style="margin: auto;margin-top: 15px" align="center">
        供应商编号:
        <div class="layui-inline">
            <input class="layui-input" name="stockName" id="supplierNum" autocomplete="off">
        </div>
        公司名称:
        <div class="layui-inline">
            <input class="layui-input" name="stockName" id="company" autocomplete="off">
        </div>
        登录名:
        <div class="layui-inline">
            <input class="layui-input" name="stockName" id="loginName" autocomplete="off">
        </div>
        <button class="layui-btn" data-type="reload" onclick="buttonSS()" id="search">查询</button>
    </div>
</script>
<script>
    layui.use('table', function () {
        $("#div2").hide();
        var table = layui.table;
        table.render({
            elem: '#text'  //html中渲染table的id
            , url: '/supplier/Sel'   //后台获取数据集合的地址
            , cellMinWidth: 80
            , toolbar: '#toolbarDemo'
            , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                , groups: 1 //只显示 1 个连续页码
                , first: false//不显示首页
                , last: false //不显示尾页

            }, cols: [
                [
                    //表单显示的title以及返回的需要显示的数据，field值与获取集合中的类的字段名一致。
                    , {width:210,field: 'id', title: '序号', align: 'center'}
                    , {width:210,field: 'supplierNum', title: '供应商编号', align: 'center'}
                    , {width:210,field: 'company', title: '公司名称', align: 'center'}
                    , {width:210,field: 'loginName', title: '登录名', align: 'center'}
                    , {width:210,field: 'createDate', title: '创建时间', align: 'center'}
                    , {width:210,fixed: 'right', width: 280, title: '操作', toolbar: "#button", align: 'center'}
                ]
            ],
        });
        buttonSS()
        table.on('tool(demo)', function (obj) {
            var data = obj.data;
            if (obj.event === 'detail') {
                $("#div1").hide();
                $("#div2").show();
                $.ajax({
                    url:"/supplier/supById",
                    data: {"id": data.supplierNum},
                    type: "GET",
                    success: function (result) {
                        alert(result)
                        $("#supplierNum1").html(result.supplierNum);
                        $("#certificate").html(result.certificate);
                        $("#company1").html(result.company);
                        $("#abbreviation").html(result.abbreviation);
                        $("#corporation").html(result.corporation);
                        $("#address").html(result.address);
                        $("#zip").html(result.zip);
                        $("#regFund").html(result.regFund);
                        $("#contact").html(result.contact);
                        $("#phone").html(result.phone);
                        $("#fax").html(result.fax);
                        $("#email").html(result.email);
                        $("#address1").html(result.address1);
                        $("#kind").html(result.kind);
                        $("#dutyParagraph").html(result.dutyParagraph);
                        $("#depositBank").html(result.depositBank);
                        $("#userId").html(result.userId);
                    }
                })
            }else if(obj.event=='edit'){

            }
        });
    })
    function buttonSS(){
        var table = layui.table;
        table.reload('text', {
            method: 'post',
            where: {
                supplierNum: $.trim($('#supplierNum').val()),
                company: $.trim($('#company').val()),
                loginName: $.trim($('#loginName').val())
            },
            page: {
                curr: 1
            }
        });
    }
    function FanHui(){
        $("#div2").hide();
        $("#div1").show();
    }
</script>
</html>